import { ref, reactive, onMounted } from "vue";
import axios from "axios";

export default () => {
  // 数据
  let dogList = reactive([
    "https://images.dog.ceo/breeds/pembroke/n02113023_1257.jpg",
  ]);
  let api = "https://dog.ceo/api/breed/pembroke/images/random";

  // 方法
  const getDog = async () => {
    try {
      let result = await axios.get(api);
      // 因为是reactive定义的响应式数据 所以可以在拿得到数据后直接放在dogList 中
      dogList.push(result.data.message);
    } catch (error) {
      alert(error);
    }
  };

  // 钩子
  onMounted(()=>{
   getDog()
  })
  // 向外面提供东西
  return {dogList,getDog}
};
